import React from "react";
import classnames from "classnames";
import { ButtonPropsType } from "./PropsType";
import TouchFeedback from "rmc-feedback";
import "./index.less";
export default function Button(props: ButtonPropsType) {
  const {
    className,
    type = "primary",
    size = "s",
    style = {},
    icon,
    disabled = false,
    activeStyle,
    activeClassName,
    onClick,
    children,
  } = props;
  console.log(activeClassName);

  const cls = classnames(
    "m-react-button",
    className,
    `size-${size} ${type} ${disabled ? "disabled" : ""}`
  );
  const prefixCls = "m-react-button";
  return (
    <TouchFeedback
      activeClassName={
        activeClassName || (activeStyle ? `${prefixCls}-active` : undefined)
      }
      activeStyle={activeStyle}
      disabled={disabled}
    >
      <div className={cls} style={{ ...style }} onClick={onClick}>
        {children}
        {icon && <div className="icon">{icon}</div>}
      </div>
    </TouchFeedback>
  );
}
